<template>
  <umi-container min-height="100vh" bg-color="#F0F0F4">
    <umi-carousel>
      <umi-carousel-item>
        <umi-image :height="240"></umi-image>
      </umi-carousel-item>
      <umi-carousel-item>
        <umi-image :height="240"></umi-image>
      </umi-carousel-item>
      <umi-carousel-item>
        <umi-image :height="240"></umi-image>
      </umi-carousel-item>
    </umi-carousel>
    <umi-row>
      <umi-col :span="14">
        <umi-container direction="horizontal" bg-color="#F74760" justify="center" align="center" :gap="16" :height="55">
          <umi-text color="#fff" :size="20">￥398</umi-text>
          <umi-text color="#fff" :size="14">限时活动</umi-text>
        </umi-container>
      </umi-col>
      <umi-col :span="10">
        <umi-container bg-color="#F8EBEA" justify="center" align="center" :gap="6" :height="55">
          <umi-text color="#FB605C" :size="12">距离结束还剩</umi-text>
          <umi-text color="#FB605C" :size="12">60 : 43 : 11</umi-text>
        </umi-container>
      </umi-col>
    </umi-row>
    <umi-container bg-color="#fff" :gap="16" padding="12px">
      <umi-text bold>2025番茄亲子艺术素质教育节·走进湛江(第三界)</umi-text>
      <umi-text color="gray">2025番茄亲子艺术素质教育节·走进湛江(第三届)，100+品课程，任选4家，最高40课时。</umi-text>
      <umi-text color="gray">54737 浏览 | 1129 购买</umi-text>
    </umi-container>
    <umi-container padding="12px">
      <umi-image src="http://static.usemath.cn/940f8af1-fce2-45ac-9d8e-8ba4784556e6.png"></umi-image>
    </umi-container>
    <umi-container padding="12px">
      <umi-image src="http://static.usemath.cn/ffef24d6-ebf1-4196-8b7c-03e58ac052b3.png"></umi-image>
    </umi-container>
    <umi-container padding="12px" :gap="12">
      <umi-text :size="16" align="center" bold>参与机构</umi-text>
      <umi-card v-for="_ in 3">
        <umi-media>
          <umi-container justify="between" height="100%">
            <umi-text bold>为莱之美</umi-text>
            <umi-container direction="horizontal" justify="between" align="end">
              <umi-space direction="vertical" :size="6">
                <umi-text color="gray">校区：1个</umi-text>
                <umi-text color="gray">机构课程：1门</umi-text>
                <umi-text color="gray">报名人数22人</umi-text>
              </umi-space>
              <umi-text color="gray">离家1.8km</umi-text>
            </umi-container>
          </umi-container>
        </umi-media>
      </umi-card>
    </umi-container>
    <umi-container padding="12px">
      <umi-image :height="500"></umi-image>
      <umi-image :height="500"></umi-image>
      <umi-image :height="500"></umi-image>
    </umi-container>
  </umi-container>
  <umi-action-bar fixed>
    <umi-row>
      <umi-col :span="4">
        <umi-container height="50px" justify="center" align="center">
          <umi-text-icon :icon-props="{ name: 'user', size: 20 }">我的</umi-text-icon>
        </umi-container>
      </umi-col>
      <umi-col :span="4">
        <umi-container height="50px" justify="center" align="center">
          <umi-text-icon :icon-props="{ name: 'kefu', size: 20 }">客户</umi-text-icon>
        </umi-container>
      </umi-col>
      <umi-col :span="16">
        <umi-container @click="$router.push({ name: 'CourseSelection' })" bg-color="#062FB8" height="50px" justify="center" align="center">
          <umi-text color="#fff">我要开团</umi-text>
        </umi-container>
      </umi-col>
    </umi-row>
  </umi-action-bar>
</template>
